//显示会员支付弹窗
import 'dart:math';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_li_ke_jie/entity/app_pay_result.dart';
import 'package:flutter_li_ke_jie/ui/home/vip_model.dart';
import 'package:flutter_li_ke_jie/ui/pay/pay_result_page.dart';
import 'package:flutter_li_ke_jie/utils/img_util.dart';
import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart';
import 'package:url_launcher/url_launcher.dart';

import '../style/common_color.dart';
import '../ui/web/web_view_page.dart';
import '../utils/navigator_util.dart';

void showVipPayDialog(BuildContext context){
  //用于在底部打开弹框的效果
  showModalBottomSheet(
      isDismissible:false,//点击外部是否关闭
      isScrollControlled:true,
      enableDrag:false,//是否可以拖动
      builder: (BuildContext buildContext) {
        //构建弹框中的内容
        return StatefulBuilder(builder: (BuildContext context, void Function(void Function()) setState) {
          return buildVipPayWidget(context,buildContext,setState);
         },
        );
        //
      },
      backgroundColor: Colors.transparent,
      context: context);
}

//构建会员支付弹窗内容
Widget buildVipPayWidget(BuildContext context,BuildContext buildContext,void Function(void Function()) setState){
  return Container(
    height: MediaQuery.of(context).size.height/3*2+50,
    padding: EdgeInsets.only(left: 10,bottom: 20,top: 20,right: 10),
    decoration: BoxDecoration(
      color: Colors.white,
      borderRadius: BorderRadius.only(topLeft: Radius.circular(20),topRight: Radius.circular(20))
    ),
    child: Column(
      children:  [
        //标题
       Stack(
          children: [
            Align(
              alignment: Alignment.center,
              child: const Text("开通会员",style: TextStyle(color: color_1e,fontSize: 18,fontWeight: FontWeight.bold),),
            ),
            Align(
              child:  GestureDetector(
                onTap: (){
                  NavigatorUtil.pop(buildContext);
                },
                child: Image.asset(ImageUtil.loadLocalImg("icon_close.png"),height: 30,width: 30,),
              ),
              alignment: Alignment.centerRight,
            )
          ],
       ),
        SizedBox(height: 10,),
        //通知 跑马灯
        _marquee(),
        SizedBox(height: 20,),
        //支付额度
        Row(
          children: [
            Expanded(
              child: _payMoneyCard(1,49.9,setState),
              flex: 1,
            ),
            SizedBox(width: 10,),
            Expanded(
              child: _payMoneyCard(2,39.9,setState),
              flex: 1,
            ),
            SizedBox(width: 10,),
            Expanded(
              child: _payMoneyCard(3,89.9,setState),
              flex: 1,
            ),
          ],
        ),
        SizedBox(height: 20,),
        //提示文字
        const Text("开通可获得专属通道，优化89%速度",style: TextStyle(color: color_999,fontSize: 14),),
        SizedBox(height: 20,),
        Container(
          color: color_eee,
          height: 0.5,
          width: MediaQuery.of(context).size.width,
        ),
        SizedBox(height: 20,),
        //支付有效时长
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            const Text("有效时长：",style: TextStyle(color: color_1e,fontSize: 14),),
            Text("${_currentVipCardIndex==1?1:_currentVipCardIndex==2?3:12}个月",style: TextStyle(color: color_1e,fontSize: 14),),
          ],
        ),
        SizedBox(height: 20,),
        Container(
          color: color_eee,
          height: 0.5,
          width: MediaQuery.of(context).size.width,
        ),
        SizedBox(height: 20,),
        //支付方式
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            const Text("支付方式：",style: TextStyle(color: color_1e,fontSize: 14),),
            Row(
              children: [
                Image.asset(ImageUtil.loadLocalImg("icon_Alipay.png"),height: 30,width: 30,),
                SizedBox(width: 5,),
                const Text("支付宝",style: TextStyle(color: color_1e,fontSize: 14),),
              ],
            )
          ],
        ),
        SizedBox(height: 20,),
        Container(
          color: color_eee,
          height: 0.5,
          width: MediaQuery.of(context).size.width,
        ),
        SizedBox(height: 50,),
        //按钮
        SizedBox(
          height: 50,
          width: MediaQuery.of(context).size.width,
          child: MaterialButton(
            color: color_F0C489,
            child: Text("确认开通",style: TextStyle(fontSize: 18,fontWeight: FontWeight.bold,color:color_774418),),
            shape: const RoundedRectangleBorder(
                borderRadius: BorderRadius.all(Radius.circular(10))
            ),
            onPressed: (){
              //开通支付
              num amount = _currentVipCardIndex==1?49.90:_currentVipCardIndex==1?39.90:89.90;
              int vipNum = _currentVipCardIndex==1?1:_currentVipCardIndex==2?3:12;
              VipModel().createVipOrder(amount,vipNum).then((appPayResult) => {
                if(appPayResult!=null){
                  // launch('https://qr.alipay.com/bax074793vhhyrpvc5r02549')
                  Navigator.push(context,MaterialPageRoute(builder:
                      (BuildContext context)=> WebViewPage(htmlStr: appPayResult.htmlStr,tag: 1,appPayResult: appPayResult,)))

                  // Navigator.push(context,MaterialPageRoute(builder:
                  //     (BuildContext context)=> PayResultPage(appPayResult)))
                  // Navigator.push(context,MaterialPageRoute(builder:
                  //     (BuildContext context)=> WebViewPage(url:"https://www.baidu.com")))
                }
              });
            },
          ),
        )
      ],
    ),
  );
}

///跑马灯
Widget _marquee() {
  return Container(
    height: 40,
    alignment: Alignment.center,
    child: Padding(
      padding: EdgeInsets.only(left: 20, right: 20),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          const Icon(Icons.notifications_active),
          Expanded(
              flex: 1,
              child: Container(
                alignment: Alignment.center,
                child: Swiper(
                  itemHeight: 40,
                  scrollDirection: Axis.vertical,
                  itemBuilder: (BuildContext context, int index) {
                    return Container(
                        alignment: Alignment.centerLeft,
                        margin: EdgeInsets.only(left: 10),
                        child: Text(
                          "恭喜尾号${_getRandomPhone()}借款成功1000元",
                          style: TextStyle(color: color_333, fontSize: 16),
                        ));
                  },
                  //条目个数
                  itemCount: 6,
                  // 自动翻页
                  autoplay: true,
                  // 相邻子条目视窗比例
                  viewportFraction: 1,
                  loop: true,
                ),
              ))
        ],
      ),
    ),
  );
}

//支付额度卡片
//当前选择支付卡片索引
int _currentVipCardIndex = 1;
Widget _payMoneyCard(int index,num money,void Function(void Function()) setState){
  return GestureDetector(
    onTap: (){
      setState((){
        _currentVipCardIndex = index;
      });
    },
    child: Container(
      decoration: BoxDecoration(
          color: index==_currentVipCardIndex?color_FFF7E8:color_f9,
          borderRadius: BorderRadius.all(Radius.circular(10))
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          SizedBox(height: 20,),
          Text(index==1?"月卡":index==2?"季卡":"年卡",style: TextStyle(color: index==_currentVipCardIndex?color_D08D18:color_1e,fontSize: 16,fontWeight: FontWeight.bold),),
          SizedBox(height: 10,),
          Row(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text("￥",style: TextStyle(color: index==_currentVipCardIndex?color_D08D18:color_1e,fontSize: 14,fontWeight: FontWeight.bold),),
              Text("${money}",style: TextStyle(color: index==_currentVipCardIndex?color_D08D18:color_1e,fontSize: 24,fontWeight: FontWeight.bold),),
            ],
          ),
          SizedBox(height: 10,),
          Text("原价:￥${index==1?"199.00":index==2?"399.00":"999.00"}",style: TextStyle(color: index==_currentVipCardIndex?color_D08D18:color_999,fontSize: 12,fontWeight: FontWeight.bold, decoration: TextDecoration.lineThrough, decorationColor: index==_currentVipCardIndex?color_D08D18:color_999,),),
          SizedBox(height: 20,),
        ],
      ),
    ),
  );
}

String _getRandomPhone(){
  int min = 1000;
  int max = 9999;
  return (min + Random().nextInt(max - min)).toString();
}